<template>
	<view class="content">
		<tabs :tabBars='tabBars' :currentIndex="currentIndex" @change="tabChange"/>
		<view class="box" v-for="item in list">
			<view class="name">
				{{ item.userName }}
				<!-- 张三 -->
			</view>
			<view class="detail" @click="goDetail(item.id)">查看详情</view>
		</view>
	</view>
</template>

<script>
	import tabs from '@/components/common/tabs/index.vue'
	import {
		selectAllSigningReport
	} from '@/apis/report/index.js'
	export default {
		components: {
			tabs
		},
		data() {
			return {
				tabBars: [{name:'已通过',value:2}, {name:'已拒绝',value: 3}],
				currentIndex:2,
				list:[
				// 	{
				// 	name:'张三',
				// 	item: 'id'
				// },
				],
				form: {
					nurseId:'',
					pageNum:1,
					pageSize:10,
					status:''
				},
				more: 'allow'
			}
		},
		onReachBottom() {
			if (this.more !== 'allow') return;
			let num = this.form.pageNum + 1
			this.selectAllSigningReport(num)
		},
		onLoad() {
			this.form.nurseId = this.$store.state.userInfo.id
			this.selectAllSigningReport(1)
		},
		
		methods: {
			tabChange(e) {
				this.currentIndex = e.value
				this.selectAllSigningReport(1)
				
			},
			selectAllSigningReport(num) {
				this.form.pageNum = num
				this.form.status = this.currentIndex
				this.more = 'loading'
				selectAllSigningReport(this.form).then(res=>{
					console.log(res)
					this.list = num > 1 ? this.list.concat(res.object.list) : res.object.list
					if(this.currentIndex == 2) {
						this.tabBars[0].name = `已通过(${res.object.total})`
						this.tabBars[1].name = `已拒绝`
					} else {
						this.tabBars[0].name = `已通过`
						this.tabBars[1].name = `已拒绝(${res.object.total})`
					}
					this.more = this.list.length >=  res.object.total ? 'end' : 'allow'
				})
			},
			goDetail(id) {
				uni.navigateTo({
					url: `./detail?id=${id}`
				})
			}
		}
		
	}
</script>

<style lang="less" scoped>
	.content {
		min-height: 100vh;
		// background-color: red;
		.box {
			padding: 48rpx 40rpx;
			display: flex;
			align-items: center;
			justify-content: space-between;
			border-bottom: 1px solid rgba(0,0,0,0.05);
			.name {
				font-weight: bold;
				font-size: 36rpx;
				color: #333333;
			}
			.detail {
				width: 144rpx;
				height: 60rpx;
				background: #3C8EFF;
				border-radius: 8rpx;
				text-align: center;
				line-height: 60rpx;
				color: #fff;
			}
		}
	}
</style>